<template>
  <div>
    <el-table
        :data="tableData"
        style="width: 100%">
      <el-table-column
          label="序号"
          type="index"
          width="80">
      </el-table-column>
      <el-table-column
          prop="userid"
          label="用户id"
          width="180">
      </el-table-column>
      <el-table-column
          prop="username"
          label="姓名"
          width="180">
      </el-table-column>
      <el-table-column
          prop="xiandanshijian"
          label="下单时间">
      </el-table-column>
      <el-table-column
          prop="kefangmingcheng"
          label="客房名称">
      </el-table-column>
      <el-table-column
          prop="zhuangtai"
          label="状态">
      </el-table-column>
      <el-table-column
          label="操作">
        <template slot-scope="scope">
<!--          <el-button size="small" type="info">
            详细
          </el-button>-->
          <el-button size="small" type="danger" @click="deleteHandler(scope)">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: "list",
  data() {
    return {
      tableData: []
    }
  },
  mounted() {
    this.inti()
  },
  methods: {
    // TODO 初始化订单页面 获取订单列表
    inti() {
      let params = {
        page: this.pageIndex,
        limit: this.pageSize,
        sort: 'id',
      }
      this.$http({
        url: "dingdan/page",
        method: "get",
        params: params
      }).then(res => {
        this.tableData = res.data.data.list
        console.log('dingdan', res.data.data.list);
      })
    },
    deleteHandler(scope) {
      console.log('delete', scope.row);
      this.$http.post(`dingdan/deletebyid/${scope.row.id}`).then(()=>{
        this.inti()
      })
    }
  }
}
</script>


<style scoped lang="scss">

</style>